<template>
  <!-- 拉取FBA货件 -->
  <a-modal :width="500" v-model:visible="showPullDialog" title="拉取FBA货件" title-align="start" :mask-closable="false" @cancel="closedDialog" :ok-loading="submitLoading" :on-before-ok="submitData">
    <a-form ref="formRef" :model="formInfo" :rules="rules">
      <a-form-item field="shop.shopId" label="店铺：" label-col-flex="100px">
        <a-select v-model="formInfo.shop" placeholder="请选择" value-key="id" allow-search>
          <a-option v-for="(shop, i) in useBaseData.shopList" :key="i" :value="shop" :label="shop.shopName" />
        </a-select>
      </a-form-item>
      <p class="warningColor" style="margin-bottom: 10px">*不填写指定，将默认拉取该店铺近30天的货件数据</p>
      <a-form-item label="指定日期范围：" label-col-flex="100px">
        <a-range-picker v-model="formInfo.times" valueFormat="YYYY-MM-DD HH:mm:ss" allow-clear :timePickerProps="{ defaultValue: ['00:00:00', '23:59:59'] }" />
      </a-form-item>
      <a-form-item label="指定状态：" label-col-flex="100px">
        <a-select v-model="formInfo.amzStatus" placeholder="请选择" allow-clear>
          <a-option v-for="status in amazonStateColumns" :key="status" :value="status" :label="status" />
        </a-select>
      </a-form-item>
      <a-form-item label="指定货件ID：" label-col-flex="100px">
        <a-input v-model="formInfo.shipmentId" allow-clear />
      </a-form-item>
    </a-form>
  </a-modal>
</template>
<script lang="ts" setup>
  import { ref } from 'vue'
  import { Message } from '@arco-design/web-vue'
  import { getAmazonFbaShipments } from '@/api/purchase'
  import useBaseDataStore from '@/store/modules/base-data'

  const emit = defineEmits(['closed', 'success'])
  const props = defineProps({
    isShow: {
      type: Boolean,
      default: false,
    },
  })

  const amazonStateColumns = ['WORKING', 'SHIPPED', 'RECEIVING', 'CLOSED', 'CANCELLED', 'ERROR', 'READY_TO_SHIP', 'IN_TRANSIT']

  const useBaseData = useBaseDataStore()
  const showPullDialog = ref(props.isShow)
  const submitLoading = ref(false)
  const formRef = ref()
  const formInfo = ref<any>({})
  const rules = ref({
    'shop.shopId': [{ required: true, message: '请选择店铺' }],
  })
  // 选择产品
  async function submitData() {
    let valid = await formRef.value.validate((valid: any) => valid)
    if (valid) return false

    let params: any = {
      marketplaceId: formInfo.value.shop?.marketplaceId,
      sellerId: formInfo.value.shop?.sellerId,
      shipmentId: formInfo.value.shipmentId,
      amzStatus: formInfo.value.amzStatus,
      startTime: formInfo.value.times?.[0],
      endTime: formInfo.value.times?.[1],
    }
    const res: any = await getAmazonFbaShipments(params)
    if (!res) return false
    Message.success('拉取成功！')
    emit('success')
    emit('closed')
  }

  // 关闭
  function closedDialog() {
    showPullDialog.value = false
    emit('closed')
  }
</script>
<style lang="less" scoped></style>
